import { innerUrls } from '@/shared/constants/urls';
import { ReactComponent as StarIcon } from '@/shared/icons/star.svg';
import { getImageUrl } from '@/shared/lib/images';
import { transformArrayIntoObject } from '@/shared/lib/transformArrayIntoObject';
import { Button, ButtonVariants } from '@/shared/ui/Button';
import cn from 'classnames';
import dayjs from 'dayjs';
import Image from 'next/image';

import cs from './CompanyReview.module.scss';

const renderStars = (amount: number) => {
  const res = [];
  for (let i = 1; i < 6; i += 1) {
    amount < i ? res.push(<StarIcon fill="#FFD662" />) : res.push(<StarIcon fill="#E1E1E1" />);
  }
  return res;
};

export const CompanyReview = ({
  productId,
  name,
  date,
  rating,
  description,
  courseImage,
  courseTitle,
  isSlider,
}: {
  name: string;
  courseTitle?: string;
  courseImage?: string;
  date: string;
  productId: number;
  isSlider?: boolean;
  rating: number;
  description?: string;
}) => (
  <div className={isSlider ? cs.cardSlide : cs.card}>
    <div className={cs.info}>
      <div className={cs.image}>{!!courseImage && <Image alt={name} fill src={getImageUrl(courseImage)} />}</div>
      <div className={cs.review}>
        <div className={cs.header}>
          <div className={cs.user}>
            {!!name && `${name},`} {dayjs(date).format('DD.MM.YYYY')}
          </div>
          <div className={cs.stars}>
            {transformArrayIntoObject(renderStars(rating)).map(({ title: star, id }, index) => (
              <div className={cn(cs.star, index < Math.round(rating) && cs.active)} key={id}>
                {star}
              </div>
            ))}
          </div>
        </div>
        <Button
          className={cs.course}
          data-testid={`link-course-${productId}`}
          href={innerUrls.course(productId)}
          link
          target="_self"
          variant={ButtonVariants.Link}
        >
          {courseTitle}
        </Button>
      </div>
    </div>
    {!!description?.trim() && (
      <div className={cn(cs.description)}>
        {description.trim()}{' '}
        {/* {!isShowAll && description.length > 87 * 2 && (
            <Button className={cs.show_all} onClick={() => setIsShowAll(true)} variant={ButtonVariants.Link}>
              Еще
            </Button>
          )} */}
      </div>
    )}
  </div>
);
